Level 2
Link Syllabus: Xem chi tiết tại đây
Phần 1: UI/UX Toàn Diện (8 Buổi)
Buổi 1: Ôn tập và nâng cao về layout trong Flutter
- Ôn tập hệ thống layout cơ bản trong Flutter:
Column
,Row
,Stack
,Expanded
. - Nâng cao với
Flex
,Spacer
, vàFractionallySizedBox
. - Tích hợp các bố cục phức tạp trong UI.
- Bài tập: Thiết kế layout cho một trang quản lý tài khoản với nhiều thành phần khác nhau (hình ảnh, thông tin cá nhân, các nút hành động).
Buổi 2: Responsive Design (Thiết kế đáp ứng)
- Xây dựng giao diện thích ứng với nhiều kích thước màn hình: điện thoại, tablet.
- Sử dụng
MediaQuery
vàLayoutBuilder
. - Giới thiệu về gói
flutter_screenutil
vàresponsive_builder
. - Bài tập: Tạo giao diện người dùng đáp ứng cho một trang sản phẩm.
Buổi 3: Hiểu về Animation trong Flutter
- Cơ bản về animation:
AnimationController
,Tween
,CurvedAnimation
. - Thực hiện animation chuyển cảnh với
Hero
widget. - Tích hợp animation vào UI với
AnimatedContainer
,AnimatedOpacity
. - Bài tập: Thêm hiệu ứng chuyển động cho các nút và các thành phần trong trang chi tiết sản phẩm.
Buổi 4: Custom UI và Sáng tạo với Widgets
- Tạo các Widget tùy chỉnh để tái sử dụng.
- Kỹ thuật xây dựng các button, card, và form độc đáo.
- Thực hành với Custom Painter để vẽ và thiết kế UI tùy chỉnh.
- Bài tập: Thiết kế một button có hiệu ứng hover và đổi màu khi nhấn.
Buổi 5: Theme và Dark Mode
- Quản lý giao diện với
ThemeData
vàMaterialApp
. - Xây dựng ứng dụng hỗ trợ chế độ sáng (Light) và tối (Dark).
- Sử dụng
Dynamic Color
để thay đổi chủ đề theo hệ điều hành. - Bài tập: Thiết kế một ứng dụng với hỗ trợ thay đổi chủ đề theo thời gian thực.
Buổi 6: Tối ưu hóa hiệu năng cho UI phức tạp
- Xác định và tối ưu hóa các vấn đề hiệu năng trong ứng dụng Flutter.
- Sử dụng
RepaintBoundary
để kiểm soát việc vẽ lại widget. - Tối ưu hóa việc sử dụng
ListView
,GridView
với lazy loading. - Bài tập: Tối ưu hóa giao diện danh sách sản phẩm với số lượng lớn.
Buổi 7: UX và Tối ưu trải nghiệm người dùng
- Hiểu rõ về các nguyên tắc UX cơ bản.
- Thiết kế các thành phần giúp cải thiện trải nghiệm người dùng: nút quay lại, swipe to refresh, pull-to-load.
- Sử dụng
GestureDetector
,InkWell
để tạo hiệu ứng tương tác. - Bài tập: Tạo chức năng "pull-to-refresh" và "swipe to delete" cho danh sách sản phẩm.
Buổi 8: Testing UI và Accessibility (Khả năng truy cập)
- Testing giao diện người dùng với
flutter_test
. - Sử dụng
Golden tests
để kiểm tra giao diện trên nhiều màn hình và trạng thái khác nhau. - Tích hợp hỗ trợ truy cập cho người khuyết tật (Accessibility): hướng dẫn sử dụng
Semantics
, cải thiện trải nghiệm cho người dùng khiếm thị. - Bài tập: Thêm Semantics cho một trang chính và thực hiện Golden test cho một màn hình.
Phần 2: Tích Hợp Database (SQL và NoSQL) (7 Buổi)
Buổi 9: Giới thiệu về Cơ sở Dữ liệu trong Flutter
- Hiểu khái niệm về cơ sở dữ liệu SQL và NoSQL.
- Lựa chọn cơ sở dữ liệu:
Sqflite
(SQL),Hive
, vàFirebase Firestore
(NoSQL). - So sánh ưu/nhược điểm và chọn giải pháp phù hợp cho ứng dụng.
- Bài tập: Thảo luận và chọn loại cơ sở dữ liệu phù hợp cho một ứng dụng cụ thể.
Buổi 10: Tích hợp SQLite với Sqflite
- Cài đặt và thiết lập
Sqflite
. - Tạo bảng, chèn, cập nhật và xoá dữ liệu.
- Thực hiện các thao tác truy vấn cơ bản (CRUD).
- Bài tập: Xây dựng một ứng dụng quản lý công việc (todo app) sử dụng SQLite.
Buổi 11: Tích hợp cơ sở dữ liệu NoSQL với Hive
- Giới thiệu về
Hive
: cơ sở dữ liệu NoSQL, nhanh, nhẹ, không cần cấu hình. - Cài đặt và thiết lập
Hive
. - Tạo box (database), lưu trữ dữ liệu dưới dạng key-value.
- Bài tập: Lưu trữ các mục công việc (todo tasks) trong
Hive
và hiển thị chúng trên giao diện người dùng.
Buổi 12: Làm việc với Firebase Firestore (NoSQL)
- Giới thiệu về Firebase Firestore.
- Cài đặt Firebase và tích hợp Firestore vào Flutter.
- Thao tác lưu trữ và truy xuất dữ liệu từ Firestore.
- Bài tập: Tích hợp Firebase vào ứng dụng để lưu trữ danh sách sản phẩm hoặc danh sách công việc.
Buổi 13: Đồng bộ hóa dữ liệu giữa SQLite và Firebase
- Đồng bộ hóa dữ liệu giữa cơ sở dữ liệu cục bộ (local) và cơ sở dữ liệu đám mây.
- Xử lý các trường hợp ngoại tuyến với SQLite.
- Chiến lược đồng bộ hóa khi người dùng trở lại trực tuyến.
- Bài tập: Đồng bộ hóa dữ liệu công việc giữa SQLite và Firestore khi có kết nối mạng.
Buổi 14: Quản lý trạng thái nâng cao với Provider và Database
- Kết hợp
Provider
để quản lý trạng thái và cơ sở dữ liệu. - Tự động cập nhật UI khi dữ liệu thay đổi.
- Xây dựng ứng dụng theo mô hình MVVM (Model-View-ViewModel).
- Bài tập: Xây dựng ứng dụng quản lý sản phẩm sử dụng
Provider
và SQLite hoặc Firestore.
Buổi 15: Triển khai dự án cuối khóa
- Phân tích và thực hiện dự án cuối khóa: xây dựng ứng dụng hoàn chỉnh kết hợp UI/UX và tích hợp cơ sở dữ liệu.
- Triển khai ứng dụng trên thiết bị di động.
- Kiểm tra và sửa lỗi.
- Bài tập cuối khóa: Xây dựng một ứng dụng quản lý công việc hoặc sản phẩm hoàn chỉnh, sử dụng giao diện người dùng đáp ứng và tích hợp cơ sở dữ liệu (SQLite/Firestore).